<template>
  <div class="page_rela_container" >
		<div class="scroll_auto flex_cell">

    <el-form ref="formEl" :model="formValue" label-width="120px" class="common-form-panel-div">

      <ex_header_spiler :title="$tt('客户价卡基础信息')" style="margin-top: 10px;"></ex_header_spiler>

      <el-row style="margin-top: 20px;">
        <el-col>
          <!--产品名称  -->
          <el-form-item :label="$tt('label_pms_product_name')">
            <el-input v-model="formValue.productName" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col>
          <!-- 产品编码 -->
          <el-form-item :label="$tt('label_pms_product_code')">
            <el-input v-model="formValue.productCode" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row >
        <el-col>
          <!-- 版本名称 -->
          <el-form-item :label="$tt('版本名称')">
            <el-input v-model="formValue.versionName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <!-- 费用配置 -->
      <ex_header_spiler :title="$tt('客户价卡配置')" style="margin-top: 10px;"></ex_header_spiler>
      <!-- ref="transportPriceEl" -->

      <div style="position: relative;">

        <el-button v-show="editType"  @click="adTabConfig" style="position: absolute;  top: 0px; right: 20px; z-index: 999; " icon="el-icon-plus">添加配置</el-button>

        <ex-button-delete
            style="position: absolute;  top: 60px; left: 420px; z-index: 999; "
            v-if=" formValue.versions && formValue.versions.length>0 && activeName != getTabId(formValue.versions[0])"
            v-show="editType"
            message="确定删除当前产品价卡配置？"
            label="删除当前配置"
            byAction
            :delAction="()=>{
            formValue.versions = formValue.versions.filter(tab => getTabId(tab) != activeName);
            activeName = getTabId(formValue.versions[0]);
          }"
        ></ex-button-delete>

        <el-tabs v-model="activeName" type="card" >
          <el-tab-pane v-for="(item,index) in formValue.versions"
                       :label="getTabTitle(item)"
                       :name=" getTabId(item) "
                       :key="item.id">
            <warehouse-price-cfg ref="warehouse_price_cfg" :key="item.id"
                                 :edit-type="editType"
                                 :versionStartTimeDisabled="index === 0"
                                 :priceVersionId="item.id"
                                 :standardServices="standardServices"
                                 :additionalServices="additionalServices"
                                 :priceUnitMap="priceUnitMap"
                                 :inputForm="item">
            </warehouse-price-cfg>
          </el-tab-pane>
        </el-tabs>

      </div>

    </el-form>

	</div>

<div class="page_rela_bottom_area"  v-show="editType">

      <el-button type="primary" @click="submitForm()">{{ $tt('label_save') }}</el-button>
      <el-button @click="goback()">{{ $tt('label_cancel') }}</el-button>
    </div>

  </div>



</template>


<script>
import WarehousePriceCfg from "@/component/pms/warehouse_price_cfg.vue";
import router_params from '@/mixin/router_params';
import WarehouseGroup from "@/component/pms/warehouse-group.vue";
import insurance_price_cfg from "@/component/pms/insurance_price_cfg.vue";
import TransportPriceCfg from "@/component/pms/transport_price_cfg.vue";
export default {
  name: "warehouse_product_edit_customer",
  components: {TransportPriceCfg, insurance_price_cfg, WarehousePriceCfg,WarehouseGroup},
  mixins: [router_params],
  data() {

    return {

      "operateType": "",
      "activeName": "",
      "formValue": {
        "versionName": "",
        "versions": []
      },

      // 服务项
      "standardServices": [],
      "additionalServices": [],
      "priceUnitMap": {},

      "isEditModel": false,

      editType: true
    };
  },

  created() {

    this.iniDefaultConfigs()

    let _this = this

    let versionId = this.$route.query.vid;
    let productId = this.$route.query.pid;

    if (this.$route.query.editType) {
      if ('false' === this.$route.query.editType) {
        this.editType = false;
      }
    }

    if (versionId && productId) {

      _this.$ajax({
        url: '/fms-api/product/PmsWarehouseCustomerPriceRpc/detail.json',
        data:{
          "versionId": versionId,
          "productId": productId
        },
        success: (res) => {

          _this.formValue = res.data

          if(_this.formValue.type == 'add'){
            this.$tag.tagModifyLabel('客户价卡新增')
          }
          else{
            if (this.editable) {
              this.$tag.tagModifyLabel('客户价卡编辑')
            }
            else {
              this.$tag.tagModifyLabel('客户价卡详情')

            }
          }

          _this.formValue.versions.forEach(r=>{
            r.labelTitle = _this.getTabTitle(r)
          })

          _this.formValue.versions.forEach(r=>{
            if(!r.id){
              r.id = 'id_' + (Math.random() + '').replace('.', '')
            }

            r.warehouses = _this.formValue.warehouses
          })

          _this.activeName = _this.getTabId( _this.formValue.versions[0] )
        }
      });
    }

  },

  mounted() {
  },

  watch: {
  },

  methods: {

    // 加载默认常量信息
    iniDefaultConfigs() {
      let _this = this
      this.$ajax({
        url: '/fms-api/product/PmsWarehouseProductRpc/getDefaultServiceForms.json',
        success: (res) => {
          _this.standardServices = res.data.standard
          _this.additionalServices = res.data.additional
        }
      });

      _this.$ajax({
        url: '/fms-api/product/PriceUnitRpc/getPriceUnitMap.json',
        success: (res) => {
          if (res && res.data) {
            _this.priceUnitMap = res.data
          }
        }
      });
    },

    adTabConfig(){

      let sample = {}

      sample = JSON.parse(JSON.stringify(this.formValue.versions[this.formValue.versions.length -1] ))

      let lastTime = sample.versionEndTime

      sample.versionStartTime = lastTime
      sample.versionStartTime = parseInt(lastTime) + 86400000
      sample.versionEndTime = parseInt(lastTime)+ 31536000000
      sample.status = 'ENABLE'

      sample.id = 'id_' + (Math.random() + '').replace('.', '')

      this.formValue.versions.push(sample)

      this.activeName = this.getTabId(this.formValue.versions[this.formValue.versions.length -1])

    },

    getTabTitle(item){
      return this.$dateFormatDate(item.versionStartTime) + ' 至 '+ this.$dateFormatDate(item.versionEndTime)
    },

    getTabId(item){
      return 'tab_' + item.id
    },

    submitForm() {

      let _this = this

      if (this.formValue.versions && this.formValue.versions.length > 0) {
        let versions = _this.$refs['warehouse_price_cfg'].map(e => e.getWarehouseFormData())

        if (!_.isEmpty(versions)){
          for (let i = 0; i < versions.length ; i++){
            var customer = versions[i];
            var warehouseGroupPriceVersion = customer.warehouseGroupPriceVersion;
            warehouseGroupPriceVersion.forEach(e => {
              e.warehouses = _this.formValue.warehouses
              e.groupId = _this.formValue.groupId
              e.groupName =  _this.formValue.groupName
            })
          }
        }

        this.formValue.versions = versions

      }

      if (_.isEmpty( this.formValue.versions)){
        this.$message({
          showClose: true,
          message: '请添加价卡版本',
          type: 'warning'
        })
        return
      }

      let submitData = this.formValue


      _this.$ajax({
        url: '/fms-api/product/PmsWarehouseCustomerPriceRpc/saveUpdate.json',
        type: 'json',
        data: submitData,
        success: (responseData) => {

          this.$message({
            showClose: true,
            message:  this.$tt('tip_submit_success'),  //'提交成功',
            type: 'success'
          })
          this.$tag.tagClose()

        },
        afterAjax() {
        }
      });

    },

    goback() {
      this.$tag.tagClose()
    }
  }
}
</script>



<style>
.product-line-limit-div, .product-line-limit-div-2 {
  display: flex;
}


.product-line-limit-div .product-line-limit-col {
  width: 220px;
  text-align: center;
  margin-right: 10px;
}

.product-line-limit-div-2 div {
  width: 300px;
  /*text-align: center;*/
  margin-right: 10px;
}

.price-cal-div-row {
  display: flex;
}

.price-cal-div-row .price-cal-col {
  width: 120px;
  text-align: center;
}

.price-cal-div-row div {
  margin-right: 8px;
  text-align: center;
}
</style>
